<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <title>苹果大数据应用平台</title>
    <link rel="stylesheet" href="../Lib/iconfont/iconfont.css" />
    <link rel="stylesheet" href="../Lib/scroll/jquery.scrollbar.css" />
    <link rel="stylesheet" href="../css/common.css" />
    <script src="../Lib/jquery-1.12.4.min.js"></script>
    <script src="../Lib/time-scrollbar.js"></script>
    <script src="../Lib/scroll/jquery.scrollbar.min.js"></script>
</head>
<body class="consume_situation">
<div class="head">
    <h3 class="title">
        <div class="logo icon-logo"></div>
        <div class="line"></div>
        <div class="name">苹果大数据应用平台</div>
    </h3>
    <div class="navigation">
        <ul class="nav">
            <li class="nav-item index"><a href="index.html">首页</a></li>
            <li class="nav-item apple-product"><a href="apple_product.html">苹果生产</a></li>
            <li class="nav-item apple-consume"><a href="consume_situation.html">苹果消费</a></li>
            <li class="nav-item commerce"><a href="trade_situation.html">对外贸易</a></li>
            <li class="nav-item market-price"><a href="price_monitor.html">市场价格</a></li>
            <li class="nav-item cost-income"><a href="income_cost.html">成本收益</a></li>
        </ul>
        <div class="profile">
            <button><i class="iconfont icon-yonghu"></i></button>
            <button><i class="iconfont icon-shezhi"></i></button>
            <button><i class="iconfont icon-tuichu"></i></button>
        </div>
    </div>
</div>

<div class="wrapper">
<div class="nav-bar-bg">
    <dl class="nav-bar">
        <dt class="navbar-item consume_situation">
            <h2><i class="iconfont icon-consume_situation"></i><a href="consume_situation.html">消费现状</a><i class="iconfont icon-arrowright"></i></h2>
            <ul>
                <li><a href="#consume_situation_消费总量">消费总量</a></li>
                <li><a href="#consume_situation_消费结构">消费结构</a></li>
                <li><a href="#consume_situation_消费水平">消费水平</a></li>
            </ul>
        </dt>
        <dt class="navbar-item consume_supplydemand">
            <h2><i class="iconfont icon-consume_supplydemand"></i><a href="consume_supplydemand.html">供求分析</a><i class="iconfont icon-arrowright"></i></h2>
            <ul>
                <li><a href="#consume_supplydemand_供求现状">供求现状</a></li>
                <li><a href="#consume_supplydemand_供求与价格">供求与价格</a></li>
                <li><a href="#consume_supplydemand_供求预测">供求预测</a></li>
                <li><a href="#consume_supplydemand_需求影响因素">需求影响因素</a></li>
            </ul>
        </dt>
        <dt class="navbar-item price_market">
            <h2><i class="iconfont icon-liutong"></i><a href="price_market.html">市场流通</a><i class="iconfont icon-arrowright"></i></h2>
            <ul>
                <li><a href="#price_market_流向监测">流向监测</a></li>
                <li><a href="#price_market_流向分析">流向分析</a></li>
            </ul>
        </dt>
        <dt class="navbar-item consume_channel">
            <h2><i class="iconfont icon-consume_channel"></i><a href="consume_channel.html">消费渠道</a><i class="iconfont icon-arrowright"></i></h2>
            <ul>
                <li><a href="#consume_channel_渠道分布">渠道分布</a></li>
                <li><a href="#consume_channel_渠道销量">渠道销量</a></li>
                <li><a href="#consume_channel_渠道特征">渠道特征</a></li>
            </ul>
        </dt>
        <dt class="navbar-item consume_blueprint">
            <h2><i class="iconfont icon-consume_blueprint"></i><a href="consume_blueprint.html">产品画像</a><i class="iconfont icon-arrowright"></i></h2>
            <ul>
                <li><a href="#consume_blueprint_产地偏好">产地偏好</a></li>
                <li><a href="#consume_blueprint_特产品类热度">特产品类热度</a></li>
                <li><a href="#consume_blueprint_档次偏好">档次偏好</a></li>
                <li><a href="#consume_blueprint_交叉组合偏好">交叉组合偏好</a></li>
                <li><a href="#consume_blueprint_产品品牌热度">产品品牌热度</a></li>
            </ul>
        </dt>

    </dl>
</div>

<div class="cont">
    <div id="consume_situation_消费总量" class="section history">
        <div class="sec-top">
            <h3 class="pub-title">消费总量</h3>
            <div class="pub-time">
                <dl class="fixtime">
                    <div class="time-des">时间：</div>
                    <div class="time-txt">2005-2014</div>
                </dl>
                <div class="another-time">
                    <ul class="time-list scrollbar-inner">
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2015-2017</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2010-2014</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2005-2009</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2000-2004</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>1995-1999</span>
                            </label>
                        </li>
                    </ul>
                    <div class="yesorno-btn">
                        <button class="time-yes" style="margin-right: 8px;">确认</button>
                        <button class="time-no">清除</button>
                    </div>
                </div>
            </div>

            <div class="else">
                <div class="help">
                    <button><i class="iconfont icon-wenhao"></i></button>
                    <div class="help-ct">
                        <div class="diy-scroll">
                            <p class='help-title'>（1）数据来源</p>
                            <p>目前国内还没有关于苹果消费的具体统计数据，在此运用产销平衡方法进行大致估计。鉴于苹果库存周期较短，跨年度消费量较小，因此忽略库存，用“国内产量+进口量-出口量”作为“国内总消费量”的估计数，即中国苹果的鲜食、加工、损耗等的消费总量。</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="sec-ct">
            <div>
              <div class="sec-part">
                  <div id="total_consume" class="echart-box">123</div>
              </div>
            </div>
        </div>
    </div>

    <div id="consume_situation_消费结构" class="section consume-construct">
        <div class="sec-top">
            <h3 class="pub-title">消费结构</h3>
            <div class="pub-time">
                <dl class="fixtime">
                    <div class="time-des">时间：</div>
                    <div class="time-txt">2005-2014</div>
                </dl>
                <div class="another-time">
                    <ul class="time-list scrollbar-inner">
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2015-2017</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2010-2014</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2005-2009</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>2000-2004</span>
                            </label>
                        </li>
                        <li class="time-item">
                            <label>
                                <input type="checkbox" name="">
                                <i class="checkbox iconfont"></i>
                                <span>1995-1999</span>
                            </label>
                        </li>
                    </ul>
                    <div class="yesorno-btn">
                        <button class="time-yes" style="margin-right: 8px;">确认</button>
                        <button class="time-no">清除</button>
                    </div>
                </div>
            </div>

            <div class="else">
                <div class="help">
                    <button><i class="iconfont icon-wenhao"></i></button>
                    <div class="help-ct">
                        <div class="diy-scroll">
                            <p class='help-title'>（1）数据来源</p>
                            <p>FAOSTAT</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="sec-ct">
            <div>
              <div class="sec-part">
                  <div id="occupy1" class="echart-box">1111</div>
                  <div>
                      <div id="occupy2" class="echart-box">2222</div>
                  </div>
              </div>
            </div>
        </div>
    </div>

    <div id="consume_situation_消费水平" class="section consume-level">
      <h3 class="pub-title">消费水平</h3>
      <div class="sec-top">
          <span>消费体量</span>
          <div class="else">
              <div class="pub-time">
                  <dl class="fixtime">
                      <div class="time-des">时间：</div>
                      <div class="time-txt">2015-2017</div>
                  </dl>
                  <div class="another-time">
                      <ul class="time-list scrollbar-inner">
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2015-2017</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2010-2014</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2005-2009</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2000-2004</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>1995-1999</span>
                              </label>
                          </li>
                      </ul>
                      <div class="yesorno-btn">
                          <button class="time-yes" style="margin-right: 8px;">确认</button>
                          <button class="time-no">清除</button>
                      </div>
                  </div>
              </div>
              <div class="pub-check">
                  <dl class="fixlocation">
                      <dt>地区：</dt>
                      <dd class="locations">
                          <span data-areaid="">全球</span>
                          <span data-areaid="">中国</span>
                          <span data-areaid="">美国</span>
                      </dd>
                  </dl>
                  <div class="another-location">
                      <span class="for-pop">国家</span>
                      <div class="pop-areas">
                          <ul class="areas scrollbar-inner">
                              <li class="area-item">
                                  <label>
                                      <input type="checkbox" />
                                      <i class="checkbox iconfont"></i>
                                      <span>全球</span>
                                  </label>
                              </li>
                              <li class="area-item">
                                  <label>
                                      <input type="checkbox" />
                                      <i class="checkbox iconfont"></i>
                                      <span>中国</span>
                                  </label>
                              </li>
                              <li class="area-item">
                                  <label>
                                      <input type="checkbox" />
                                      <i class="checkbox iconfont"></i>
                                      <span>美国</span>
                                  </label>
                              </li>
                          </ul>
                          <div class="yesorno-btn">
                              <button class="yes" style="margin-right: 30px;">确认</button>
                              <button class="no">清除</button>
                          </div>
                      </div>
                  </div>
              </div>
              <!-- <ul class="pub-radio">
                  <li class="active">鲜食苹果</li>
                  <li>苹果加工</li>

              </ul> -->
              <div class="help">
                  <button><i class="iconfont icon-wenhao"></i></button>
                  <div class="help-ct">
                      <div class="diy-scroll">
                          <p class='help-title'>（1）数据来源</p>
                          <p>FAOSTAT</p>
                      </div>
                  </div>
              </div>
          </div>
      </div>
      <div class="sec-ct">
          <div>
              <div class="sec-part">
                  <div id="consume-level" class="echart-box">111111</div>
              </div>
          </div>
      </div>
    </div>


    <div id="trade_situation_人均消费" class="section consume-personal">
      <div class="sec-top">
          <span class="">人均消费</span>
          <div class="else">
              <div class="pub-time">
                  <dl class="fixtime">
                      <div class="time-des">时间：</div>
                      <div class="time-txt">2015-2017</div>
                  </dl>
                  <div class="another-time">
                      <ul class="time-list scrollbar-inner">
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2015-2017</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2010-2014</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2005-2009</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>2000-2004</span>
                              </label>
                          </li>
                          <li class="time-item">
                              <label>
                                  <input type="checkbox" name="">
                                  <i class="checkbox iconfont"></i>
                                  <span>1995-1999</span>
                              </label>
                          </li>
                      </ul>
                      <div class="yesorno-btn">
                          <button class="time-yes" style="margin-right: 8px;">确认</button>
                          <button class="time-no">清除</button>
                      </div>
                  </div>
              </div>
              <div class="pub-check">
                  <dl class="fixlocation">
                      <dt>地区：</dt>
                      <dd class="locations">
                          <span data-areaid="">全球</span>
                          <span data-areaid="">中国</span>
                          <span data-areaid="">美国</span>
                      </dd>
                  </dl>
                  <div class="another-location">
                      <span class="for-pop">国家</span>
                      <div class="pop-areas">
                          <ul class="areas scrollbar-inner">
                              <li class="area-item">
                                  <label>
                                      <input type="checkbox" />
                                      <i class="checkbox iconfont"></i>
                                      <span>全球</span>
                                  </label>
                              </li>
                              <li class="area-item">
                                  <label>
                                      <input type="checkbox" />
                                      <i class="checkbox iconfont"></i>
                                      <span>中国</span>
                                  </label>
                              </li>
                              <li class="area-item">
                                  <label>
                                      <input type="checkbox" />
                                      <i class="checkbox iconfont"></i>
                                      <span>美国</span>
                                  </label>
                              </li>
                          </ul>
                          <div class="yesorno-btn">
                              <button class="yes" style="margin-right: 30px;">确认</button>
                              <button class="no">清除</button>
                          </div>
                      </div>
                  </div>
              </div>
              <ul class="pub-radio">
                  <li class="active">人均消费总量</li>
                  <li>鲜食苹果</li>
                  <li>苹果加工</li>
              </ul>
              <div class="help">
                  <button><i class="iconfont icon-wenhao"></i></button>
                  <div class="help-ct">
                      <div class="diy-scroll">
                          <p class='help-title'>（1）数据来源</p>
                          <p>FAOSTAT</p>
                      </div>
                  </div>
              </div>
          </div>
      </div>
      <div class="sec-ct">
          <div>
              <div class="sec-part">
                  <div id="consume-personal" class="echart-box">111111</div>
              </div>
          </div>
      </div>
    </div>


</div>


</div>

<!-- 图片背景 -->
<div class="body-bg">
    <img src="../images/bg_body.jpg">
</div>

<script src="../Lib/Echarts/echarts.common.min.js"></script>
<script src="../Lib/Echarts/echarts-engine.js"></script>
<script src="../js/public.js"></script>

<script src="../js/unite.js"></script>
<script src="../js/consume.js"></script>
</body>
</html>
